<!-- common start -->
#include("common.html")
<!-- common end -->
<!DOCTYPE html>
<html>
 <head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  <meta content="width=device-width, minimum-scale=1,initial-scale=1, maximum-scale=1, user-scalable=1;" id="viewport" name="viewport"> 
  <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> 
  <!--离线应用的另一个技巧--> 
  <meta content="yes" name="apple-mobile-web-app-capable"> 
  <!--指定的iphone中safari顶端的状态条的样式--> 
  <meta content="black" name="apple-mobile-web-app-status-bar-style"> 
  <!--告诉设备忽略将页面中的数字识别为电话号码--> 
  <meta content="telephone=no" name="format-detection"> 
  <meta http-equiv="Page-Enter" content="revealTrans(duration=5, transition=2)"> 
  <meta http-equiv="Page-Exit" content="revealTrans(duration=5, transition=2)"> 
  <title>照片</title> 
  <meta name="description" content="站点描述"> 
  <meta name="keywords" content="站点默认关键字"> 
  <link rel="stylesheet" type="text/css" href="#(tpath)/static/css/basic.css"> 
  <link rel="stylesheet" type="text/css" href="#(tpath)/static/css/style.css"> 
  <script type="text/javascript" src="#(tpath)/static/js/jquery.min.js"></script> 
  <script type="text/javascript" src="#(tpath)/static/js/TouchSlide.1.1.js"></script> 
  <script src="#(tpath)/static/js/slide-js.js"></script> 
  <script type="text/javascript" src="#(tpath)/static/js/respond.min.js"></script> 
  <script type="text/javascript" src="#(tpath)/static/js/respond.src.js"></script> 
  <script type="text/javascript" src="#(tpath)/static/js/script.js" defer></script> 
  <script type="text/javascript" src="#(tpath)/static/js/lazy.js"></script> 
  <script>
    $(function(){
$("img").lazyload({
threshold : 200,
effect : "fadeIn"
});
     })
</script> 
  <!--[if lt IE 9]>
<script>
document.createElement('video');
</script>
<![endif]--> 
 </head> 
 <body> 
  <div id="wrap"> 
    <!-- header start -->
 #include("header.html")
 <!-- header end -->
   <div class="zpzs_banner"> 
    <div class="bd"> 
     <ul> 
      <li style="background:url(#(tpath)/static/images/1470379060676.png) center center no-repeat;"></li>
      <li style="background:url(#(tpath)/static/images/1470379060676.png) center center no-repeat;"></li> 
     </ul> 
    </div> 
    <div class="hd"> 
     <ul> 
     </ul> 
    </div> 
   </div> 
   <script type="text/javascript">
		jQuery(".zpzs_banner").slide({ titCell:".hd ul", mainCell:".bd ul", effect:"fold",  autoPlay:true, autoPage:true, trigger:"click" });
	</script> 
   <div class="pbanner" id="pbanner"> 
    <div class="bd"> 
     <ul> 
      <li> <a class="pic" href="#"><img src="#(tpath)/static/images/1470379060676.png"></a> </li>
      <li> <a class="pic" href="#"><img src="#(tpath)/static/images/1470379060676.png"></a> </li> 
     </ul> 
    </div> 
    <div class="hd"> 
     <ul></ul> 
    </div> 
   </div> 
   <script type="text/javascript">
		TouchSlide({
			slideCell:"#pbanner",
			titCell:".hd ul", //开启自动分页 autoPage:true ，此时设置 titCell 为导航元素包裹层
			mainCell:".bd ul",
			effect:"leftLoop",
			autoPage:true,//自动分页
			autoPlay:true //自动播放
		});
	</script> 
   <div class="pagenav clearfix"> 
    <div class="pcbox"> 
     <div class="pagenav_nav clearfix"> 
      <ul> 
      #category_children_list(categoryId=currentCategory.parentId)
      #for(category : categorys)
       <li #if(category.id==currentCategory.id)class="on"#end><a href="#(category.path)">#(category.name)</a></li> 
       #end
      #end 
      </ul> 
     </div> 
    </div> 
   </div> 
   #content_page(categoryId = currentCategory.id,pageNumber = pageNumber,pageSize = 9)
   <div class="zp_main"> 
    <div class="pcbox"> 
     <div class="zp_list clearfix"> 
      <section id="gallery-wrapper"> 
      #for(content : contentPage.list)
       <article class="white-panel"> 
        <a href="#(content.path)"><img src="#(tpath)/static/images/1-161214112333-lp.jpg" class="thumb"> <h1>学员照片七</h1></a> 
       </article>
       #end
      </section> 
      <script src="#(tpath)/static/js/pinterest_grid.js"></script> 
      <script type="text/javascript">
                    $(function(){
                        $("#gallery-wrapper").pinterest_grid({
                            no_columns: 4,
                            padding_x: 30,
                            padding_y: 30,
                            margin_bottom:100,
                            single_column_breakpoint: 700
                        });

                    });
                </script> 
     </div> 
    </div> 
   </div> 
   <div class="page" style="margin-bottom:60px"> 
    <div>
     #page(pageNumber = contentPage.pageNumber,totalPages = contentPage.totalPage,pattern = currentCategory.path+"?pageNumber=")
        #include("page.html")
     #end
    </div> 
   </div> 
   #end
   <!-- footer start -->
 #include("footer.html")
 <!-- footer end -->
  </div>  
 </body>
</html>